<template>
	<mu-container>
		<mu-appbar style="width: 100%;">
			<mu-button icon slot="left" @click='$root.back'>
				<mu-icon value="arrow_back"></mu-icon>
			</mu-button>
			个人中心
		</mu-appbar>
		<mu-container style="margin-top: 10%;">
			<mu-list class="badge-list-wrap">
				<mu-list-item>
					<mu-list-item-content>
						<mu-list-item-title>头像：</mu-list-item-title>
					</mu-list-item-content>
					<mu-list-item-action>
						<mu-avatar size="40"><img src="../assets/logo.png" /></mu-avatar>
					</mu-list-item-action>
				</mu-list-item>
				<mu-list-item>
					<mu-list-item-content>
						<mu-list-item-title>编号：</mu-list-item-title>
					</mu-list-item-content>
					<mu-list-item-action>
						<span class="c_spec">{{loginInfo.id}}</span>
					</mu-list-item-action>
				</mu-list-item>
				<mu-list-item>
					<mu-list-item-content>
						<mu-list-item-title>昵称：</mu-list-item-title>
					</mu-list-item-content>
					<mu-list-item-action>
						<span class="c_spec">{{loginInfo.name}}</span>
					</mu-list-item-action>
				</mu-list-item>
				<mu-list-item>
					<mu-list-item-content>
						<mu-list-item-title>手机号：</mu-list-item-title>
					</mu-list-item-content>
					<mu-list-item-action>
						<span class="c_spec">{{loginInfo.phone || loginInfo.name}}</span>
					</mu-list-item-action>
				</mu-list-item>
				<!-- <mu-list-item>
					<mu-list-item-content>
						<mu-list-item-title>创建时间：</mu-list-item-title>
						</mu-list-item-action>
							<mu-badge content="12"></mu-badge>
						</mu-list-item-action>	
					</mu-list-item-content>
				</mu-list-item> -->
			</mu-list>
			<mu-button color="success" @click="payTest">支付0.01元</mu-button>
		</mu-container>
		<Bar class='bar'></Bar>
	</mu-container>
</template>

<script>
	import config from '../config'
	import Bar from '@/components/bar.vue'
	export default {
		components: {
			'Bar': Bar
		},
		data() {
			return {
				loginInfo: {},
			}
		},
		created() {

		},
		mounted: function() {
			this.$nextTick(() => {
				this.userInfo();
			})
		},
		methods: {
			//获取用户信息
			userInfo() {
				var _this = this;
				_this.$root.profile()
			},

			payTest() {
				this.$root.pay(1, '0.01支付', '测试支付0.01元')
			},
		},
	}
</script>

<style>
	.container {
		padding-left: 0px !important;
		padding-right: 0px !important;
	}

	.mu-appbar-title {
		padding-left: 0px !important;
		padding-right: 3.125rem !important;
	}

	.bar {
		position: fixed;
		bottom: 0px;
	}

	.badge-list-wrap {
		width: 100%;
		max-width: 360px;
		margin: 0 auto;
	}
</style>
